<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <a href="https://juejin.cn/post/6888150116138483719">本次学习原链接--闭包</a>
    <script>
        // 闭包的意义：
        // 闭包函数的存在，延长了外部局部变量的生命周期
        // 1. js 如何知道闭包内部函数，用了哪些父函数的局部变量
        //      - 不需要知道，没有显示的引用的父级变量，他们也一直都在
        //        闭包保留父级全部变量，不管用没用到
        // 2. js 如何确定 onclick 消失后 要回收哪些变量？
        // 3. 父级的变量不回收的话，父级的父级呢？
        // let obj = { c: 1 };
        // function show() {
        //     let a = 12;
        //     let b = 5;
        //     document.onclick = function () {
        //         // eval 括号内 函数运行返回值 交给 eval 出结果
        //         alert(eval(prompt("请随便输入一个表达式")))
        //         // 外部输入a+b，会用到a和b
        //     }
        // }
        // show();
        // setTimeout(() => {
        //     document.onclick = null;
        //     obj = null; // 手动垃圾回收
        // }, 5000)

        // 垃圾回收之--计数器
        let a = { name: 'blue', age: '19' }; // a 引用了 json 计数+1
        let b = a; // b 引用了 json 计数+1=2
        a = null; // a 不再指向 json，但是因为有b引用json，所以json还在 计数-1=1
        console.log(b); // b 仍在指向 json 计数=1，>0,不回收
        b = null; // b 不再指向 json 计数-1=0，可回收。待到下一次垃圾回收时回收

        // 闭包=外部变量+函数
        function fn1() {
            let a = 1;
            function fn2() {
                let b = 5;
                document.onclick = function () {
                    //dom事件的存在，延长了外部变量的生命周期
                }
            }
            fn2(); // a计数-1
        }
    </script>
</body>

</html>